Adwaita: Improve emoji picker styling
authornana-4 <hnmaigo@gmail.com>
Sat, 12 Dec 2020 07:52:49 +0000 (16:52 +0900)
committernana-4 <hnmaigo@gmail.com>
Sun, 13 Dec 2020 20:26:39 +0000 (05:26 +0900)
- Add borders around the main scrollable content, like most other
  places.
- Set padding and spacing on .emoji-searchbar and .emoji-toolbar in a
  more proper way.
- Remove unused button.emoji-section label styles.

gtk/theme/Adwaita/_common.scss

index 845582650d04c4d79976e098734af05dd17b1fc0..ba86fdba9c62bdb4c0b4e5041844338b6ea8d905 100644 (file)
@@ -4229,8 +4229,18 @@ stackswitcher.circular {
 
 popover.emoji-picker > contents {
   padding: 0;
+}
 
-  entry.search { margin: 5px; }
+.emoji-searchbar {
+  padding: 6px;
+  border-spacing: 6px;
+  border-bottom: 1px solid $borders_color;
+}
+
+.emoji-toolbar {
+  padding: 6px;
+  border-spacing: 6px;
+  border-top: 1px solid $borders_color;
 }
 
 button.emoji-section {
@@ -4239,7 +4249,6 @@ button.emoji-section {
   border-style: none none solid;
   border-radius: 0;
 
-  margin: 2px 8px 4px;
   padding: 3px 0 0;
   min-width: 32px;
   min-height: 28px;
@@ -4249,20 +4258,8 @@ button.emoji-section {
   box-shadow: none;
   text-shadow: none;
 
-  &:dir(ltr):not(:last-child) { margin-right: 0; }
-  &:dir(rtl):not(:last-child) { margin-left: 0; }
-
   &:hover { border-color: if($variant == 'light', $borders_color, transparentize($fg_color, .9)); }
   &:checked { border-color: $selected_bg_color; }
-
-  label {
-    padding: 0;
-
-    opacity: 0.55;
-  }
-
-  &:hover label { opacity: 0.775; }
-  &:checked label { opacity: 1; }
 }
 
 popover.emoji-picker emoji {